<template>
	<view class="refund-con">
		<view class="refund-ul">
			<view class="refund-title">
				<text class="refund-d-titleL">{{selectCountData.allSelected ? '已退款菜品' : '请选择退款菜品'}}</text>
				<text class="refund-d-titleR">{{shopName||''}}</text>
			</view>
			<view class="refund-list">
				<view class="flex flex-direction" v-for="(item,index) in goodlist" :key="index">
					<view class="refund-li" v-if="item.vtwo_type!='813'&&item.vtwo_type!='814'">
						<view class="refund-li-l" :class="{gry:item.refundCheckStatus!='5'&&item.select}"
							@click="tabSelect(item)">
							<!--  <checkbox :value="item.id" :checked="item.status" color="#31AE5C" style="transform:scale(0.7)" /> -->
							<text class="text-xll margin-right-xs"
								:class="item.select?'cuIcon-roundcheckfill':'cuIcon-round'"
								v-if="item.refundCheckStatus=='5'"></text>
							<text class="text-xll margin-right-xs cuIcon-roundcheckfill" v-else
								style="color:#D6D6D6"></text>
							<!-- <uni-data-checkbox v-model="item.statue" selectedTextColor="#31AE5C" selectedColor="#31AE5C" @change="changeCheck" multiple></uni-data-checkbox> -->
							<view class="refund-li-imgText">
								<!-- <image class="imgCon" :src="env.imgBaseUrl + item.vmaster_product_image_id" mode=""></image> -->
								<tb-image width="120rpx" height="120rpx" borderRadius="10rpx"
									:src="env.imgBaseUrl + (item.specImageUrl?item.specImageUrl:item.vmaster_product_image_id)">
									<template v-slot:error>
										<image src="../../../static/menuEmpty.png" class="imgCon" mode="aspectFill">
										</image>
									</template>
								</tb-image>
								<view class="refund-li-Text">
									<text class="marbuttom refund-font-style">{{ item.vname }}</text>
									<text class="refund-font-style refund-font-style9">x{{item.nsell_nums}}</text>
								</view>
							</view>
						</view>
						<view class="refund-li-r">
							<view class="refund-font-style">¥{{ item.ngoods_sell_price}}</view>
							<!-- <view v-if="item.nmoney!=item.ngoods_sell_price" class="text-c9" style="color: #FDB44A;margin-top: 10rpx;">
            		可退金额<tetx style="color: #FDB44A">¥{{ item.nmoney  }}</tetx></view> -->
							<view class="uninumbe-con"
								v-if="item.nsell_nums > 1 && item.vtwo_type!=='813' && item.refundCheckStatus=='5'">
								<uni-number-box v-if="item.seleNum" v-model="item.seleNum"
									@changes="changeNum($event,item)" allowInput fontSize="40rpx" :min="0"
									:max="(item.nsell_nums||0) - (item.refundNum||0)" />
							</view>
						</view>
					</view>
					<!-- <view v-else-if="item.vtype_two='814'"></view> -->
					<!-- 单套餐退款 -->
					<view class=" flex flex-direction" v-else style="margin-bottom: 20rpx;">
						<view class="flex justify-between">
							<view class="refund-li-l marpadding"
								:class="{gry:item.refundCheckStatus!='5'&&item.tcselect}" @click="tabSelect(item)">
								<!--  <checkbox :value="item.id" :checked="item.status" color="#31AE5C" style="transform:scale(0.7)" /> -->
								<text class="text-xll margin-right-xs"
									:class="item.tcselect?'cuIcon-roundcheckfill':'cuIcon-round'"
									v-if="item.refundCheckStatus=='5'"></text>
								<text class="text-xll margin-right-xs cuIcon-roundcheckfill" v-else
									style="color:#D6D6D6"></text>
								<!-- <uni-data-checkbox v-model="item.statue" selectedTextColor="#31AE5C" selectedColor="#31AE5C" @change="changeCheck" multiple></uni-data-checkbox> -->
								<view class="refund-li-imgText">
									<!-- <image class="imgCon" :src="env.imgBaseUrl + item.vmaster_product_image_id" mode=""></image> -->
									<tb-image width="120rpx" height="120rpx" borderRadius="10rpx"
										:src="env.imgBaseUrl + (item.specImageUrl?item.specImageUrl:item.vmaster_product_image_id)">
										<template v-slot:error>
											<image src="../../../static/menuEmpty.png" class="imgCon" mode="aspectFill">
											</image>
										</template>
									</tb-image>
									<view class="refund-li-Text">
										<text class="marbuttom refund-font-style">{{ item.vname }}</text>
										<text
											class="refund-font-style refund-font-style9">x{{item.nsell_nums || item.sxp_nsell_nums || 0}}</text>
									</view>
								</view>
							</view>
							<view class="refund-li-r" style="padding-top: 20rpx;">
								<view class="refund-font-style">¥{{ item.ngoods_sell_price || item.nmoney || 0}}</view>
								<!-- <view v-if="item.nmoney!=item.ngoods_sell_price" class="text-c9" style="color: #FDB44A;margin-top: 10rpx;">
              		可退金额<tetx style="color: #FDB44A">¥{{ item.nmoney  }}</tetx></view> -->
								<view class="uninumbe-con"
									v-if="item.nsell_nums > 1 && item.vtwo_type!=='813' && item.refundCheckStatus=='5'">
									<uni-number-box v-if="item.seleNum" v-model="item.seleNum"
										@changes="changeNum($event,item)" allowInput fontSize="40rpx" :min="0"
										:max="(item.nsell_nums||0) - (item.refundNum||0)" />
								</view>
							</view>
						</view>
						<view class="submenus">
							<view class="refund-li  flex justify-between" v-for="(menu,index) in item.sxpGoods"
								:key="index">
								<view class="refund-li-l" style="align-items: initial;"
									:class="{gry:menu.refundCheckStatus!='5'&&menu.select}"
									@click="menuTabSelect(menu,item)">
									<text class="text-xll margin-right-xs"
										:class="menu.select?'cuIcon-roundcheckfill':'cuIcon-round'"
										v-if="menu.refundCheckStatus=='5'"></text>
									<text class="text-xll margin-right-xs cuIcon-roundcheckfill" v-else
										style="color:#D6D6D6"></text>
									<view class="refund-li-imgText refund-li-imgText">
										<view class="refund-li-Text flex-direction flex justify-between"
											style="padding-left: 0;">
											<text class="marbuttom refund-font-style">{{ menu.vname }}</text>
											<text
												class="refund-font-style refund-font-style9">x{{menu.nsell_nums}}</text>
										</view>
									</view>
								</view>
								<view class="refund-li-r">
									<view class="refund-font-style">¥{{ menu.ngoods_sell_price}}</view>
									<!-- <view v-if="item.nmoney!=item.ngoods_sell_price" class="text-c9" style="color: #FDB44A;margin-top: 10rpx;">
                		可退金额<tetx style="color: #FDB44A">¥{{ item.nmoney  }}</tetx></view> -->
									<view class="uninumbe-con"
										v-if="menu.nsell_nums > 1 && menu.refundCheckStatus=='5'">
										<uni-number-box v-if="menu.seleNum" v-model="menu.seleNum"
											@changes="changeNum($event,menu,item)" allowInput fontSize="40rpx" :min="0"
											:max="(menu.nsell_nums||0) - (menu.refundNum||0)" />
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view v-if="dataList.vtype!='568'" class="flex flex-direction yhpsf-con">
					<view class="flex justify-between">
						<text class="">用户配送费</text>
						<text
							:class="{tkActiove:selectCountData.totalNum + selectCountData.refundNum !==  selectCountData.goodsNum}">￥{{dataList.vfreight_money||0}}</text>
					</view>
					<text v-if="selectCountData.totalNum + selectCountData.refundNum !==  selectCountData.goodsNum&&dataList.vfreight_money>0">
						<text class="color99">部分退,配送费不退还</text>
					</text>
				</view>
			</view>
		</view>
		<!-- 退款金额 -->
		<view class="refund-ul">
			<view class="refund-title">
				<text class="refund-d-titleL">
					退款金额
				</text>
				<!-- <text class="refund-d-titleR redBig">¥{{ selectCountData.totalMoney}}</text> -->
				<view class="flex" style="width:228rpx">
					<!-- <text class="refund-d-titleR redBig">¥</text> -->
					<block v-if="!selectCountData.allSelected">
						<input class="redBigs" placeholder-class="redBigs" type="number" placeholder="请输入退款金额"
							v-model="selectCountData.refundedAmount" />
					</block>
					<block v-else>
						<text class="redBigs ntotalMoney">{{dataList.ntotal_money||''}}</text>
					</block>
				</view>

			</view>
			<view class="refund-lists" v-show="false">
				<view class="refund-lists-con" v-for="(item,index) in refundData" :key="index">
					<view class="refund-lists-title refund-lists-radiu">{{ item.title }}</view>
					<view class="refund-lists-title refund-lists-title-flex" v-for="(list,index) in item.child"
						:key="index">
						<text>{{ list.title }}</text>
						<text>¥{{ list.pic }}</text>
					</view>
				</view>
			</view>
			<view class="flex justify-between" style="padding-top: 30rpx;">
				<text class="refund-d-titleL">优惠金额</text>
				<view class="flex">
					<text>-¥{{dataList?.ncoupon_money + dataList?.nman_back_money||0}}</text>
				</view>
			</view>
			<view class="refund-user">
				<view class="refund-user-l">退回账户</view>
				<view class="refund-user-r">
					<text>原支付账户</text>
					<text><text class="refund-user-color">1-3</text>个工作日到账</text>
				</view>
			</view>
		</view>
		<!-- 退款原因 -->
		<view class="refund-ul">
			<view class="refund-title">
				<view class="refund-d-titleL">退款原因<text class="refund-bixuan">(必选)</text></view>
			</view>
			<view class="refund-radiu">
				<!-- <radio-group @change="radioChange"> -->
				<view class="refund-radiu-ul" v-for="(item,index) in refundRadiu" @click="tabRadioSel(item,index)"
					:key="index">
					<view>{{ item.v_name}}</view>
					<text class="text-xll" :class="item.select?'cuIcon-roundcheckfill':'cuIcon-round'"></text>
					<!-- <radio :value="item.id" style="transform:scale(0.8)"/> -->
				</view>
				<!-- </radio-group> -->
			</view>
		</view>
		<!-- 上传图片 -->
		<view class="refund-ul" v-if="!selectCountData.allSelected">
			<view class="refund-title">
				<view class="refund-d-titleL">上传图片</view>
			</view>
			<view class="file-con">
				<view class="addIm" @click="changeStatus">
					<view class="addim">
						<cl-upload ref="upImg" v-model="list" :action="action" :headers="headers"
							:fileName="'uploadFile'" @onSuccess="onSuccess" :autoUpload="false" :data="formData">
							<template v-slot:addImg>
								<view class="flex justify-center align-center flex-direction flexBox-con">
									<text class="fcon-a-tianjiazhaopian1 ics"></text>
									<view class="add_t">添加图片</view>
								</view>
							</template>
						</cl-upload>
					</view>
				</view>
			</view>
		</view>
	</view>
	<view class="refund-footer">
		<text class="refund-btn" :class="{refundedBg:selectCountData.allSelected}" @click="btnSub">申请退款</text>
	</view>
</template>

<script setup lang="ts">
	import { ref, reactive, computed, nextTick } from 'vue';
	import mapi from '@/utils/mapi'
	import { onLoad, onShow, } from "@dcloudio/uni-app";
	import { env } from '@/api/env.js'
	import { getRefund, getRefundBillData, getRefundReasona } from '@/api/vmeitime-http/index.js'
	import { mnavTo, showLoading, hideLoading } from '@/utils/helper';
	const checkbox = ref()
	const list = ref([])
	const selectList = ref([])  //选中的sku
	const reasonNum = ref() //退款原因
	const backNum = ref()  //数量
	const totalMoney = ref()
	const upImg = ref()
	const bill_id = ref()
	const dataList = ref<any>({})
	const goodlist = ref([])
	const isUploads = ref(false)
	const tkMoneys = ref<any>('')
	// const action = ref('https://gy.ysxdgy.com/v1/common/upload') fileUploadUrl //http://test-static.yekjx.com/upload.do ?dirPath=goods&resouceId=&resouceType=1&dataType=198&fileLimit=1
	// const action = ref( env.fileUploadUrl + '/upload.do' )
	const action = ref(env.FileUploadUrl + '/upload.do')
	const headers = ref({
		// token: 'e672c63d4e034fc08054f83ad479ee3e'    
		// tiket:uni.getStorageSync('user_tiket')
	})
	const formData = {
		'dirPath': 'goods',
		'resouceType': 1,
		'fileLimit': 1,
		'dataType': 198
	}

	const mentuList = reactive([
		{
			id: 0,
			title: '橄榄油老姜云耳炒鸡100g',
			num: 1,
			pic: 13,
			calorie: 175,
			status: 0,
			select: false,
			imgSrc: 'https://cdn-static.yekjx.com/food/images/cod_img01.png',
		},
		{
			id: 1,
			title: '女性瘦瘦推荐套餐',
			num: 1,
			pic: 20,
			calorie: 560,
			status: 0,
			select: false,
			imgSrc: 'https://cdn-static.yekjx.com/food/images/cod_img02.png',
		},
		{
			id: 2,
			title: '橄榄油老姜云耳炒鸡100g',
			num: 1,
			pic: 13,
			calorie: 175,
			status: 0,
			imgSrc: 'https://cdn-static.yekjx.com/food/images/cod_img01.png',
		}
	])

	const refundData = reactive([
		{
			id: 0,
			title: '可退项目',
			child: [
				{
					title: '微信支付',
					pic: '20'
				},
				{
					title: '平台红包',
					pic: '2'
				}
			]
		},
		{
			id: 1,
			title: '不可退项目',
			child: [
				{
					title: '商家优惠',
					pic: '满30-3'
				}
			]
		}
	])

	const refundRadiu = ref([])

	// const checkboxChange = (e:any)=> {
	//   console.log( e.detail)
	// }

	// const radioChange = (e:any)=> {
	//   console.log( e.detail)
	// }

	const verification_type = ref(0)
	const identity_images = ref([])
	const loaded = ref(false) //是否在请求数据

	const onSuccess = (reslut : any) => {
		console.log('onSuccess', reslut)
	}
	const shopName = ref('');
	onShow(() => {
		loaded.value && !isUploads.value && getLabel(bill_id.value)
		// tkMoneys.value=selectCountData.value.totalMoney
	})
	onLoad((options) => {
		shopName.value = options.shopName || '';
		if (options.vbill_id) {
			bill_id.value = options.vbill_id
			!loaded.value && getLabel(bill_id.value)
			getRefundReasonaList()
		}
		console.log('bill_id.value--------------------', bill_id.value)
	})
	//修改数量-number
	const changeNum = (e : any, list : any, item ?: any) => {
		console.log('changenum+', e);
		if (item && (item.vtwo_type === '813' || item.vtwo_type == '814')) {
			nextTick(() => {
				item.tcselect = selectCountData.value.packageSecNum && selectCountData.value.packageSecNum === selectCountData.value.packageTotal;
			});
		}

		if (e.nums <= 0) {
			list.select = false;
		}
	};
	const selectCountData = computed(() => {
		let num = 0, goodsNum = 0, totalMoney = 0, skus = [], carriage = 0, selectedNums = 0, totalNumzs = 0, refundedAmount = 0, refundAmount = 0, refundNum = 0, packageTotal = 0, packageSecNum = 0, allSelected = false;

		if (goodlist.value.length > 0) {
			goodlist.value.forEach(item => {
				allSelected = goodlist.value.every(item => item.refundCheckStatus == '6') //是否全部退款
				refundNum += item.refundNum  //已退款数量
				if (item.vtwo_type !== '813' && item.vtwo_type !== '814') {
					goodsNum += item.nsell_nums;
					if (item.select && item.refundCheckStatus == '5') {
						num += item.seleNum; //已经选择的数量
						totalMoney += item.nprice * item.seleNum
						if (item.nsell_nums == item.seleNum && item.refundNum == 0) {
							refundAmount = item.nmoney;
							console.log('全部选中退款------------------', refundAmount);
						} else if (item.nsell_nums - item.refundNum == item.seleNum && item.refundNum > 0) {
							// refundAmount = item.nmoney - Math.trunc(item.refundNum * item.nmoney * 100 / item.nsell_nums) / 100;
							refundAmount = item.nmoney - Math.trunc(item.nmoney * 100 / item.nsell_nums) / 100 * item.refundNum
							console.log('最后一次退款l----------------------------', refundAmount)
						} else {
							refundAmount = Math.trunc(item.nmoney * 100 / item.nsell_nums) / 100 * item.seleNum
							// refundAmount = Math.trunc(item.seleNum * item.nmoney * 100 / item.nsell_nums) / 100;
							console.log('单个退款----------------------------', refundAmount, item.nsell_nums, item.refundNum);
						}
						refundedAmount += refundAmount; // 更新已退金额
						const refundDetail = {
							nbill_goods_detail_id: item.nbill_goods_detail_id,
							backNum: item.seleNum   // 退货数量
						};
						skus.push(refundDetail);
					}
				} else {
					item.sxpGoods.forEach(tcItem => {
						goodsNum += tcItem.nsell_nums;
						packageTotal += tcItem.nsell_nums
						refundNum += tcItem.refundNum
						if (tcItem.select && tcItem.refundCheckStatus == '5') {
							packageSecNum += tcItem.seleNum //套餐已经选中的数量
							num += tcItem.seleNum; //已经选择的数量
							if (tcItem.nsell_nums == tcItem.seleNum && tcItem.refundNum == 0) {
								refundAmount = tcItem.nmoney
							} else if (tcItem.nsell_nums - tcItem.refundNum == tcItem.seleNum && tcItem.refundNum > 0) {
								refundAmount = tcItem.nmoney - Math.trunc(tcItem.nmoney * 100 / tcItem.nsell_nums) / 100 * tcItem.refundNum
								// refundAmount = tcItem.nmoney - Math.trunc(tcItem.refundNum * tcItem.nmoney * 100 / tcItem.nsell_nums) / 100;
							} else {
								refundAmount = Math.trunc(tcItem.nmoney * 100 / tcItem.nsell_nums) / 100 * tcItem.seleNum
								// refundAmount = Math.trunc(tcItem.seleNum * tcItem.nmoney * 100 / tcItem.nsell_nums) / 100;
							}
							const refundDetail = {
								nbill_goods_detail_id: tcItem.nbill_goods_detail_id,
								backNum: tcItem.seleNum   // 退货数量
							};
							skus.push(refundDetail);
							refundedAmount += refundAmount
						}
					})
				}
				selectedNums += (item.select ? 1 : 0);
			})
		}
		if (num + refundNum == goodsNum) {
			carriage = (dataList.value.vfreight_money || 0);
			refundedAmount += carriage; // 所有item.select为true 并且 总数量totalNumzs === num选中的数 才加运费
		}
		const rmoney = totalMoney > 0 ? totalMoney.toFixed(2) : 0;
		tkMoneys.value = rmoney;
		const r = {
			totalQuantity: totalNumzs,
			totalNum: num,  //已经选择的数量  
			totalMoney: rmoney,
			carriage,  //运费
			skus, //商品信息
			goodsNum, //商品总数量
			refundedAmount: refundedAmount.toFixed(2),  //退款金额
			allSelected,  //是否全部退款
			refundNum, //商品已经退款数量
			packageSecNum,  //套餐选中的数量
			packageTotal, //套餐内商品总数量
		}
		console.log('slslslsl+', r, goodlist.value.length)
		return r
		// if (goodlist.value.length == 0) {
		// 	return {
		// 		totalNum: num,
		// 		totalMoney: totalMoney
		// 	};
		// }
		// goodlist.value.forEach(item => {
		// 	if (item.select) {
		// 		num += item.nsell_nums;
		// 		totalMoney += item.nmoney * item.nsell_nums;
		// 	}
		// })
		// const hasOneRefo = goodlist.value.filter(item => item.refundCheckStatus == '0').length == 1;
		// let allSelect = goodlist.value.every((it : any) => it.select == true)
		// totalMoney += hasOneRefo || allSelect ? dataList.value.vfreight_money || 0 : 0
		// return {
		// 	totalNum: num,
		// 	totalMoney: totalMoney
		// };
	});
	//提交
	const btnSub = async () => {
		// selectList.value.length == 0
		if (selectCountData.value.allSelected) {
			return mapi.msg('商品退款中')
		}
		if (!selectCountData.value.skus) {
			return mapi.msg('请选择需要退款的商品')
		}
		if (!reasonNum.value) {
			return mapi.msg('请选择退款原因')
		}
		// if (tkMoneys.value == '' || Number(tkMoneys.value) == 0) {
		// 	return mapi.msg('请输入退款金额')
		// }
		// if (Number(tkMoneys.value) > Number(selectCountData.value.totalMoney)) {
		// 	return mapi.msg('退款金额大于可退金额')
		// }
		if (selectCountData.value.refundedAmount == '' || Number(selectCountData.value.refundedAmount) == 0) {
			return mapi.msg('请输入退款金额')
		}
		try {
			let res = await upImg.value.submit();
			let imgList = [];
			console.log('upImg', res);
			res && res.forEach((item : any) => {
				console.log('link---', item.link)
				item.link && imgList.push(item.link)
			})
			console.log('提交imgList:', imgList)
			// let num = 0;
			// goodlist.value.forEach(item => {
			// 	if (item.select) {
			// 		num += item.nsell_nums;
			// 	}
			// })
			let params = {
				freightMoney: String(selectCountData.value.carriage) || 0, //yun费
				address: dataList.value.vaddress_detail,//地址
				vbill_id: dataList.value.vbill_id,
				details: selectCountData.value.skus,
				// sku: selectCountData.value.skus,//selectList.value.join(',')
				vtype: '71', //70：退款退货  71：退款  72：退货  73：换货
				vcause: String(reasonNum.value), //退款原因
				ntotal_money: String(selectCountData.value.refundedAmount), //退款金额 selectCountData.totalMoney
				// integral: '0', //积分
				// backNum: num,//数量
				imageList: imgList,
				// goodsDiscusList: [...paramsArr]
			}
			console.log('要提交的数据------------------', params)
			submitForm(params)
		} catch (e) {
			console.error(e);
		}
	}
	//退款
	const submitForm = async (data : any) => {
		try {
			showLoading()
			let res = await getRefund(data)
			if (res) {
				hideLoading();
				if (res.result) {
					mapi.msg('正在退款中');
					setTimeout(() => {
						uni.navigateBack();
					}, 800)
					// mnavTo('/pages/others/completedDettial/completedDettial?bill_id=' +  bill_id.value )
				} else {
					mapi.msg(res.shortMessage || '网络繁忙，请稍后再试!');
				}
				// mapi.msg('提交失败');
				// console.log('提交成功------------------------------------------------------------', res)
			}
		} catch (e) {
			hideLoading();
			mapi.msg('网络繁忙，请稍后再试!');
		}
	}

	const tabSelect = (item : any) => {
		if (item.refundCheckStatus != '5') {
			return
		}
		toggleSelection(item)
		// if(item.vtwo_type=='813'){  //套餐
		//   item.select = !item.select;
		//   if(item.select){
		//     item.sxpGoods.forEach((child:any)=>{
		//       child.select = true
		//     })
		//   }else{
		//     item.sxpGoods.forEach((child:any)=>{
		//       child.select = false
		//     })
		//   }
		// }else{  //非套餐
		//   item.select = !item.select;
		//   item.seleNum = item.select ? (item.nsell_nums||0) - (item.refundNum||0) : 0;
		// }
	}

	const toggleSelection = (item : any) => {
		// 切换选中状态
		// 根据选中状态进行不同操作
		if (item.vtwo_type && (item.vtwo_type === '813' || item.vtwo_type == '814')) {  // 套餐
			item.tcselect = !item.tcselect;
			item.seleNum = item.select ? item.sxp_nsell_nums : 0
			item.sxpGoods.forEach((child : any) => {
				child.select = item.tcselect;  // 套餐时，所有子项的选中状态与父项一致
				child.seleNum = child.select ? (child.nsell_nums || 0) - (child.refundNum || 0) : 0;
			});
		} else {  // 非套餐
			item.select = !item.select;
			item.seleNum = item.select ? (item.nsell_nums || 0) - (item.refundNum || 0) : 0;
		}
	};
	const menuTabSelect = (menu : any, item : any) => {
		if (menu.refundCheckStatus != '5') {
			return
		}
		menu.select = !menu.select;
		const allSubItemsSelected = item.sxpGoods.every((subItem : any) => subItem.select);
		item.tcselect = allSubItemsSelected
		console.log(allSubItemsSelected, '子项是否全部选中')
		menu.seleNum = menu.select ? (menu.nsell_nums || 0) - (menu.refundNum || 0) : 0;
	}
	const tabRadioSel = (list : any, index : any) => {
		if (selectCountData.value.allSelected) return;
		refundRadiu.value.forEach((item) => {
			item.select = false
		});
		list.select = true
		reasonNum.value = list.n_seq
	}

	//菜单详情
	const getLabel = async (id : any) => {
		try {
			showLoading()
			loaded.value = true;
			let res = await getRefundBillData({
				billId: id
			})
			hideLoading();
			if (!res.result || !res.object) {
				return
			}

			res.object.goodsList.forEach((item : any, index : number) => {
				// if (item.refundNum) {
				// 	item.nsell_nums = item.nsell_nums - item.refundNum
				// }
				item.seleNum = (item.nsell_nums || 0) - (item.refundNum || 0);//默认选中可退数量
				item.select = true;
				if (item.vtwo_type == '813' || item.vtwo_type == '814') {
					// sxp_nsell_nums 数量  nmoney 钱 
					// itme.refundCheckStatus 
					let tcSelected = item.sxpGoods.every((good : any) => good.refundCheckStatus == 6) ? 6 : 5;
					console.log(tcSelected, '----------------------------------')
					item.seleNum = item.sxp_nsell_nums
					item.tcselect = true;
					item.sxpGoods.forEach((i : any) => {
						i.select = true
						i.seleNum = (i.nsell_nums || 0) - (i.refundNum || 0);//默认选中可退数量
					})
					item.nsell_nums = item.sxp_nsell_nums
					item.ngoods_sell_price = item.nmoney
					item.specImageUrl = item.vshare_image_url
					item.refundCheckStatus = tcSelected
				}
				// 将整个 goodsList 赋值给最后一项的 item.meal
				if (index === res.object.goodsList.length - 1) {
					item.meal = res.object.goodsList; // 将 goodsList 赋值给最后一项的 meal
				}
				// item.select = item.refundCheckStatus == '0'? false:true;
			})
			goodlist.value = res.object.goodsList;
			dataList.value = res.object;
			console.log('菜单详情----', goodlist.value);
			setTotalMoneys()
		} catch (e) {
			loaded.value = true;
			hideLoading();
			// mapi.msg('网络繁忙，请稍后再试!');
		}
	}
	const setTotalMoneys = () => {
		const hasOneRefo = goodlist.value.filter(item => item.refundCheckStatus == '5').length == 1;
		tkMoneys.value = hasOneRefo ? dataList.value.vfreight_money || 0 : 0;
	}
	//退款原因
	const getRefundReasonaList = async () => {
		try {
			showLoading()
			let res = await getRefundReasona();
			hideLoading();
			if (res.result && res.object) {
				let nres = res.object || [];
				// tags.value = res.object
				nres.forEach((item : any) => {
					item.select = false;
				})
				refundRadiu.value = nres;
				console.log('退款原因--', nres)
			}
		} catch (e) {
			hideLoading();
			mapi.msg('网络繁忙，请稍后再试!');
		}
	}
	const changeStatus = () => {
		isUploads.value = true
	}
</script>

<style scoped lang="scss">
	page {
		background-color: #F8F8FA;
	}

	.refundedBg {
		background: #E4E4E4 !important;
		color: #fff !important;
	}

	.yhpsf-con {
		// padding-left: 55rpx;

		.color99 {
			color: #999;
			font-size: 24rpx;
			margin-top: 5rpx;
		}
	}

	.tkActiove {
		text-decoration: line-through;
	}

	.addIm {
		width: 100%;
		margin: auto;
		display: flex;
		margin-top: 20rpx;

		// padding-left: 20rpx;
		.addim {
			width: 100%;

			.flexBox-con {
				width: 136.5rpx;
				height: 144rpx;
				border-radius: 12rpx;
				background: #F6F7F9;
			}

			.ics {
				color: #DADBDC;
				font-size: 48rpx;
				// margin:30rpx 0rpx 0rpx 40rpx;
				display: block;
			}

			.add_t {
				color: #999;
				text-align: center;
				font-size: 24rpx;
				margin-top: 10rpx;
			}
		}

	}

	.addim {
		width: 100%;

		.flexBox-con {
			width: 136.5rpx;
			height: 144rpx;
			border-radius: 12rpx;
			background: #F6F7F9;
		}

		.ics {
			color: #DADBDC;
			font-size: 48rpx;
			// margin:30rpx 0rpx 0rpx 40rpx;
			display: block;
		}

		.add_t {
			color: #999;
			text-align: center;
			font-size: 24rpx;
			margin-top: 10rpx;
		}
	}

	.cuIcon-round {
		color: #999;
	}

	.cuIcon-roundcheckfill {
		color: $base-color;
	}

	.refund-footer {
		justify-content: center;
		width: 100%;
		height: 130.882rpx;
		flex-shrink: 0;
		background: #FFF;
		box-shadow: 0px -12px 8.9px 0px rgba(0, 0, 0, 0.10);
		display: flex;
		align-items: center;

		.refund-btn {
			width: 690rpx;
			height: 82rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			flex-shrink: 0;
			border-radius: 96rpx;
			background: linear-gradient(0deg, #53A87F 0%, #53A87F 100%), linear-gradient(45deg, #4CA27B 0%, #82D7B0 100%);
			color: #FFF;
			font-feature-settings: 'clig' off, 'liga' off;
			font-family: "Microsoft YaHei UI";
			font-size: 32rpx;
			font-style: normal;
			font-weight: 700;
		}
	}

	.file-con {
		padding: 20rpx 0;

		.customStyle {
			display: flex;
			flex-direction: column;
			justify-items: center;
			align-items: center;

			.cuIcon-style {
				font-size: 40rpx;
				color: #CCC;
			}

			.custom-text-style {
				color: #CCC;
				font-feature-settings: 'clig' off, 'liga' off;
				font-family: "Microsoft YaHei UI";
				font-size: 24rpx;
				font-weight: 400;
				margin-top: 20rpx;
			}
		}
	}

	.refund-con {
		width: 677.402rpx;
		margin: 0 auto;
		padding: 30rpx 0 60rpx;
	}

	.refund-bixuan {
		color: #999;
		font-feature-settings: 'clig' off, 'liga' off;
		font-family: "Microsoft YaHei UI";
		font-size: 28rpx;
		font-style: normal;
		font-weight: 400;
		margin-left: 20rpx;
	}

	.refund-radiu-ul {
		display: flex;
		justify-content: space-between;
		padding: 20rpx 0;
	}

	.refund-ul {
		border-radius: 20rpx;
		background: #FFF;
		flex-shrink: 0;
		margin-bottom: 20rpx;
		width: 100%;
		padding: 20rpx;

		.refund-user {
			padding: 20rpx 0;
			display: flex;
			justify-content: space-between;
			align-items: end;

			.refund-user-l {
				color: #333;
				font-feature-settings: 'clig' off, 'liga' off;
				font-family: "Microsoft YaHei UI";
				font-size: 32rpx;
				font-style: normal;
				font-weight: 700;

			}

			.refund-user-r {
				display: flex;
				flex-direction: column;
				text-align: right;

				text {
					color: #333;
					font-feature-settings: 'clig' off, 'liga' off;
					font-family: "Microsoft YaHei UI";
					font-size: 28rpx;
					font-style: normal;
					font-weight: 400;

					&:last-child {
						margin-top: 10rpx;
					}
				}

				.refund-user-color {
					color: #FDB44A;
				}
			}
		}

		.refund-lists-con {
			margin-bottom: 10rpx;
		}

		.refund-lists {
			width: 636.5rpx;
			margin: 0 auto;
			padding: 20rpx 40rpx;
			border-radius: 5px;
			background: #FAFAFA;
			flex-shrink: 0;

			.refund-lists-title-flex {
				display: flex;
				justify-content: space-between;
				color: #999;
				font-feature-settings: 'clig' off, 'liga' off;
				font-family: "Microsoft YaHei UI";
				font-size: 28rpx;
				font-style: normal;
				font-weight: 400;
				padding-left: 20rpx;

				text {
					margin-bottom: 10rpx;
				}
			}

			.refund-lists-radiu {
				color: #333;
				font-feature-settings: 'clig' off, 'liga' off;
				font-family: "Microsoft YaHei UI";
				font-size: 28rpx;
				font-style: normal;
				font-weight: 400;
				margin-bottom: 10rpx;
				padding-left: 20rpx;
				position: relative;

				&::before {
					content: '';
					left: 0;
					width: 11rpx;
					height: 11rpx;
					border-radius: 50%;
					background-color: #333;
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
				}
			}
		}

		.refund-d-titleL {
			color: #333;
			font-family: "Microsoft YaHei UI";
			font-size: 32rpx;
			font-weight: 700;
		}

		.refund-d-titleR {
			color: #999;
			font-family: "Microsoft YaHei UI";
			font-size: 24rpx;
			font-weight: 400;
		}

		.redBig {
			color: #FC4C40;
			font-feature-settings: 'clig' off, 'liga' off;
			font-family: "Microsoft YaHei UI";
			font-size: 20px;
			font-style: normal;
			font-weight: 700;
		}

		.refund-title {
			border-bottom: 1px solid #F8F8F8;
			padding-top: 10rpx;
			padding-bottom: 25rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
		}
	}

	.submenus {
		width: 100%;
		border-radius: 10rpx;
		background: #FAFAFA;
		padding: 30rpx 20rpx;
		position: relative;

		&::after {
			content: '';
			position: absolute;
			bottom: 100%;
			/* 将三角形放在上方 */
			left: 80rpx;
			/* 三角形的水平位置，可以根据需要调整 */
			width: 0;
			height: 0;
			border-left: 15rpx solid transparent;
			/* 三角形的左边 */
			border-right: 15rpx solid transparent;
			/* 三角形的右边 */
			border-bottom: 15rpx solid #FAFAFA;
			/* 三角形的颜色 */
		}
	}



	.text-thr {
		text-decoration: line-through;
	}

	//上传图片修改默认样式
	:deep .file-picker__box-content {
		margin: 0 !important;
	}

	:deep .uni-file-picker__container {
		margin: 0 20rpx 20rpx 0;
		justify-content: flex-start;
		gap: 20rpx;
		/* 子元素向左对齐 */
		/* 设置子元素之间的间隔 */
		// &:nth-last-child(1){
		// 	margin: 0 0 20rpx 0;
		// }
	}

	:deep .file-picker__progress {
		bottom: -10rpx;
	}

	:deep .redBigs {
		color: #FC4C40;
		font-weight: 700;
		margin-top: 2rpx;
		text-align: right;
		font-size: 40rpx;
	}

	.ntotalMoney {
		width: 100%;
	}

	.refund-li-r {
		text-align: right;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.refund-li-l {
		display: flex;
		align-items: center;

		&.gry {
			.cuIcon-roundcheckfill {
				color: #999;
			}
		}

		.refund-font-style {
			color: #333;
			font-feature-settings: 'clig' off, 'liga' off;
			font-family: "Microsoft YaHei UI";
			font-size: 28rpx;
			font-style: normal;
			font-weight: 400;
		}

		.refund-font-style9 {
			color: #999;
		}

		.refund-li-Text {
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			padding-left: 20rpx;
			padding-top: 5rpx;
			padding-bottom: 5rpx;

			.marbuttom {
				margin-bottom: 15rpx;
			}

		}

		.refund-li-imgText {
			display: flex;
			// align-items: center;
			margin-left: 10rpx;

			.imgCon {
				width: 120rpx;
				height: 120rpx;
				border-radius: 10rpx;
			}
		}
	}

	.marpadding {
		padding-top: 20rpx;
		margin-bottom: 20rpx;
	}

	.refund-li {
		display: flex;
		justify-content: space-between;
		padding: 20rpx 0;
	}

	.uninumbe-con {
		margin-right: -13rpx;
	}
</style>